<template>
	<cl-dialog
		title="选择责任人"
		width="650px"
		:visible.sync="visible"
		:before-close="beforeClose"
		@close="close"
		:props="{
			top: '10vh',
			appendToBody: true,
			closeOnClickModal: false
		}"
	>
		<el-form ref="form" :model="form" :rules="rules" label-position="top" :disabled="saving">
			<el-form-item label="责任人" prop="duty_id">
				<el-radio-group v-model="form.duty_id" style="width: 100%">
					<el-row>
						<el-col :span="8" v-for="(item, index) in userList" :key="index">
							<el-radio :label="item.user_id" name="user_id">
								{{ item.user_name }}
							</el-radio>
						</el-col>
					</el-row>
				</el-radio-group>
			</el-form-item>
		</el-form>
		<template #footer>
			<el-button @click="close">关闭</el-button>
			<el-button type="primary" @click="submit" :loading="saving">确定</el-button>
		</template>
	</cl-dialog>
</template>

<script>
export default {
	inject: ["parent"],
	data() {
		return {
			visible: false,
			saving: false,
			order_no: null,
			form: {
				main_id: "",
				dept_id: "",
				duty_id: ""
			},
			rules: {
				duty_id: [{ required: true, message: "请选择责任人" }]
			},
			userList: []
		};
	},
	methods: {
		open(data = {}) {
			this.visible = true;
			this.form.main_id = data?.main_id;
			this.form.dept_id = data?.dept_id;
			this.order_no = data?.order_no
			this.getPeople();
		},
		submit() {
			this.$refs.form.validate(async (valid, errors) => {
				this.showFormErr(errors);
				if (!valid) return;
				try {
					this.saving = true;
					const { dept_id, ...args } = this.form;
					let form = {
						...args
					};
					await this.$service.order.resetOrder(form);
					this.$message.success("操作成功");
					this.$emit("confirm");
					this.parent.getDetail();
					this.saving = false;
					this.close();
				} catch (error) {
					this.saving = false;
				}
			});
		},
		beforeClose(done) {
			if (this.saving) return;
			done();
		},
		close() {
			if (this.saving) return;
			this.visible = false;
			this.reset();
		},
		reset() {
			this.saving = false;
			this.$refs.form.resetFields();
		},
		//获取人员
		async getPeople() {
			let { dept_id } = this.form;
			this.userList = [];
			const data = await this.$service.user.dutyteacher({
				order_no: this.order_no,
			});
			this.userList = data;
		}
	}
};
</script>

<style lang="scss" scoped>
::v-deep {
	.el-radio {
		margin-bottom: 10px !important;
	}
}
</style>
